<template>
  <div>
    <header v-if="showTitle">
      <slot name="foo" />
    </header>

    <main v-if="showItems">
      <slot name="items" />
    </main>
  </div>
</template>
<script>
import { defineComponent } from 'vue';
export default defineComponent({
  name: 'MyContainer',
  computed: {
    showTitle() {
      return !!this.$slots.foo;
    },
    showItems() {
      return !!this.$slots.items;
    }
  }
})
</script>
<style lang="">

</style>